<template>
  <div class="home">
    <!-- 头部nav -->
    <HeaderNav />
    <!-- 吸顶 -->
    <AppHeaderstivky />
    <!-- 头部header -->
    <HeaderHeader />
    <!-- 中间contaner -->
    <div class="container">
      <router-view />
    </div>
    <!-- 底部组件 -->
    <FooterApp />
  </div>
</template>
<script>
import HeaderNav from '@/components/HeaderNav.vue'
import HeaderHeader from '@/components/HeaderHeader.vue'
import FooterApp from '@/components/FooterApp.vue'
import AppHeaderstivky from '@/components/AppHeaderstivky.vue'
export default {
  components: { HeaderNav, HeaderHeader, FooterApp, AppHeaderstivky },
  mounted() {
    this.$store.dispatch('category/asyncSetCate')
  },
}
</script>
<style lang="scss" scoped>
@import "../assets/css/color.scss";
@import "../assets/css/components.scss";
@import "../assets/css/common.scss";
@mixin set($size, $color) {
  font-size: $size;
  color: $color;
}
.home {
  width: 100%;
  height: 100%;
  .container {
    min-height: 600px;
  }
}
</style>